<template>
  <div>
    <el-divider content-position="left">个人信息</el-divider>
    <el-descriptions  direction="vertical" :column="4" border="true">
      <el-descriptions-item label="学号">{{ students.s_id }}</el-descriptions-item>
      <el-descriptions-item label="姓名">{{ students.s_name }}</el-descriptions-item>
      <el-descriptions-item label="邮箱" :span="2">{{ students.s_email }}</el-descriptions-item>
      <el-descriptions-item label="电话">{{ students.s_tel }}</el-descriptions-item>
      <el-descriptions-item label="小组">{{ students.group_id }}</el-descriptions-item>
      <el-descriptions-item label="是否组长">{{ students.leader==0?"否":"是" }}</el-descriptions-item>
    </el-descriptions>

    <el-divider content-position="left">小组信息</el-divider>
    <el-table
      title="小组信息"
      :data="tableData"
      stripe
      style="width: 100%">
      <el-table-column
        prop="s_id"
        label="学号"
        width="180">
      </el-table-column>
      <el-table-column
        prop="s_name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="s_email"
        label="邮箱">
      </el-table-column>
      <el-table-column
        prop="s_tel"
        label="手机号">
      </el-table-column>
      <el-table-column
        label="组长">
        <template slot-scope="scope">
          <span>{{ scope.row.leader === 0?'否':'是'  }}</span>
        </template>
      </el-table-column>
    </el-table>

    <el-divider content-position="left">指导老师</el-divider>
    <el-descriptions  direction="vertical" :column="5" border="true">
      <el-descriptions-item label="工号">{{ teacher.t_id }}</el-descriptions-item>
      <el-descriptions-item label="姓名">{{ teacher.t_name }}</el-descriptions-item>
      <el-descriptions-item label="邮箱" :span="2">{{ teacher.t_email }}</el-descriptions-item>
      <el-descriptions-item label="电话">{{ teacher.t_tel }}</el-descriptions-item>
    </el-descriptions>
  </div>

</template>

<script>
import { showInfor } from '@/api/user'
export default {

  data() {
    return {
      students: { },
      tableData: [],
      teacher: {}

    }
  },
  created: function() {
    showInfor(this.$store.getters.token).then(response => {
      this.students = response.data.students
      this.tableData = response.data.list
      this.teacher = response.data.teacher
    })
  }

}

</script>

<style lang="scss" scoped>

</style>
